<template>
    <div>
        <el-card shadow="always" class="mianbao">
            公交车管理
        </el-card>
        <div class="shousuo">
            <el-autocomplete
                    popper-class="my-autocomplete"
                    v-model="state"
                    :fetch-suggestions="querySearch"
                    placeholder="请输入编号进行搜索"
                    @keyup.enter.native="chaxunId"
                    @select="handleSelect" style="margin-right: 10px;margin-left: 20px">
                <i
                        class="el-icon-search el-input__icon"
                        slot="suffix"
                        @click="handleIconClick">
                </i>
                <template slot-scope="{ item }">
                    <div class="name">{{ item.value }}</div>
                    <span class="addr">{{ item.address }}</span>
                </template>
            </el-autocomplete>


            <el-autocomplete
                    popper-class="my-autocomplete"
                    v-model="state1"
                    :fetch-suggestions="querySearch1"
                    @keyup.enter.native="chaxunId1"
                    placeholder="请输入线路搜索"
                    @select="handleSelect" style="margin-right: 10px;margin-left: 20px">
                <i
                        class="el-icon-search el-input__icon"
                        slot="suffix"
                        @click="handleIconClick">
                </i>
                <template slot-scope="{ item }">
                    <div class="name">{{ item.value }}</div>
                    <span class="addr">{{ item.address }}</span>
                </template>
            </el-autocomplete>


            <el-autocomplete
                    popper-class="my-autocomplete"
                    v-model="state2"
                    :fetch-suggestions="querySearch2"
                    placeholder="请输入发车间隔(分钟)"
                    @keyup.enter.native="chaxunId2"
                    @select="handleSelect" style="margin-right: 10px;margin-left: 20px">
                <i
                        class="el-icon-search el-input__icon"
                        slot="suffix"
                        @click="handleIconClick">
                </i>
                <template slot-scope="{ item }">
                    <div class="name">{{ item.value }}</div>
                    <span class="addr">{{ item.address }}</span>
                </template>
            </el-autocomplete>







            <!--点击新增只弹出对话框-->
            <el-button type="warning" round style="margin-right: 5px;margin-left: 230px" icon="el-icon-plus"
                       @click="insertBus()">新增
            </el-button>
            <el-button type="danger" round style="margin-right: 5px;" icon="el-icon-delete"
                       @click="DeleteBus()">删除
            </el-button>
            <el-button type="success" round style="margin-right: 10px;" icon="el-icon-download"
                       @click="downloadBus()">导出
            </el-button>



        </div>
        <div>
            <el-table
                    :data="tableData"
                    v-loading="hhhh"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.8)"
                    border
                    style="width: 100%;margin-top: 20px"
                    stripe
                    @sort-change="changeSort"
                    :header-cell-style="tableHeaderColor"
                    @selection-change="handleSelectionChange">
                <el-table-column
                        type="selection"
                        width="55">
                </el-table-column>
                <el-table-column
                        prop="createTime"
                        label="起始日期"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="id"
                        label="公交车牌"
                        width="100">
                </el-table-column>
                <el-table-column
                        prop="route"
                        label="行驶路线"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="dayNum"
                        width="100"
                        sortable="custom"
                        label="日人流量">
                </el-table-column>
                <el-table-column
                        prop="mouthNum"
                        width="100"
                        label="月人流量">
                </el-table-column>
                <el-table-column
                        prop="yearNum"
                        width="100"
                        label="年人流量">
                </el-table-column>
                <el-table-column
                        prop="times"
                        width="100"
                        label="日出车次数">
                </el-table-column>
                <el-table-column
                        label="操作" :formatter="formatter">
                    <template slot-scope="scope">
                        <el-button type="primary" round @click="information(scope.row)">详情</el-button>
                        <el-button type="success" round @click="updateBus(scope.row.id)">修改</el-button>
                        <el-button type="danger" round @click="deleteBus(scope.row)">删除</el-button>
                        <el-button v-if="scope.row.chuli==1" type="warning" round @click="xiugai(scope.row)">警告</el-button>
<!--                        <el-button type="info" round @click="deleteBus(scope.row)">查看</el-button>-->
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <el-pagination
                background
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="urlparam.num"
                :page-sizes="[15, 30, 60, 120]"
                :page-size="urlparam.size"
                layout="total, sizes, prev, pager, next, jumper"
                :total="tabletotal">
        </el-pagination>




<!--        <div>-->
<!--            <img src="http://localhost:8081/bus/getImg/1"/>-->
<!--        </div>-->

        <el-dialog
                title="详情"
                :visible.sync="dialogVisible1"
                width="30%"
                :before-close="handleClose1">
            <span>详细信息</span>
            <img :src="imgSrc" width="200px" height="200px"/>
            <br>
            <br>
            <br>
            <span>车牌:</span>
            <span style="margin-left: 10%">
                <el-tag v-if="xiangqing.chepai!=null">
                    {{xiangqing.chepai}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>路程数:</span>
            <span style="margin-left: 7%">
                <el-tag v-if="xiangqing.distanceNumber!=null">
                    {{xiangqing.distanceNumber}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>车轮情况:</span>
            <span style="margin-left: 3%">
                <el-tag v-if="xiangqing.lun!=null">
                    {{xiangqing.lun}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>车窗情况:</span>
            <span style="margin-left: 3%">
                <el-tag v-if="xiangqing.chuang!=null">
                    {{xiangqing.chuang}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>车椅情况:</span>
            <span style="margin-left: 3%">
                <el-tag v-if="xiangqing.yizi!=null">
                    {{xiangqing.yizi}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>其他情况:</span>
            <span style="margin-left: 3%">
                <el-tag v-if="xiangqing.sex!=null">
                    {{xiangqing.sex}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>油量:</span>
            <span style="margin-left: 10%">
                <el-tag v-if="xiangqing.youlian!=null">
                    {{xiangqing.youlian}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
            </span>
            <br>
            <br>
            <br>
            <span>上传日期:</span>
            <span style="margin-left: 3%">
                <el-tag v-if="xiangqing.time!=null">
                    {{xiangqing.time}}
                </el-tag>
                <el-tag type="danger" v-else>无</el-tag>
                </span>
            <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible1 = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible1 = false">确 定</el-button>
  </span>
        </el-dialog>


        <el-dialog title="修改信息" :visible.sync="dialogFormVisible" width="550px">
            <el-form :model="form" v-loading="loading"
                     element-loading-text="拼命加载中"
                     element-loading-spinner="el-icon-loading"
                     element-loading-background="rgba(0, 0, 0, 0.8)">
                <el-form-item label="车牌编号" :label-width="formLabelWidth">
                    <el-input v-model="form.id" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="开运时间" :label-width="formLabelWidth">
                    <el-date-picker
                            v-model="form.createTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm:ss"
                             value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="每日发车时间" :label-width="formLabelWidth">
                    <el-date-picker
                            v-model="form.beginTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="每日停车时间" :label-width="formLabelWidth">
                    <el-date-picker
                            v-model="form.endTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="发车时间间隔" :label-width="formLabelWidth">
                    <el-input v-model="form.betweenNum"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="updateBuselse(form.id)">确 定</el-button>
            </div>
        </el-dialog>
        <!--新增公交对话框-->
        <el-dialog title="新增公交" :visible.sync="dialogVisible2" width="550px">
            <el-form :model="busForm" ref="busForm">
                <el-form-item label="公交编号" :label-width="formLabelWidth">
                    <el-input v-model="busForm.id" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="车牌号" :label-width="formLabelWidth">
                    <el-input v-model="busForm.chepai" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="行驶路线" :label-width="formLabelWidth">
                    <el-autocomplete
                            popper-class="my-autocomplete"
                            v-model="route1"
                            :fetch-suggestions="querySearch3"
                            placeholder="请选择路线"
                            @select="handleSelect">
                        <i
                                class="el-icon-search el-input__icon"
                                slot="suffix"
                                @click="handleIconClick">
                        </i>
                        <template slot-scope="{ item }">
                            <div class="name">{{ item.value }}</div>
                        </template>
                    </el-autocomplete>
<!--                    <el-input v-model="busForm.route" autocomplete="off"></el-input>-->
                </el-form-item>
                <el-form-item label="开运时间" :label-width="formLabelWidth">
                    <el-date-picker
                            v-model="busForm.createTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="每日发车时间" :label-width="formLabelWidth">
                    <el-date-picker
                            v-model="busForm.beginTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="每日停车时间" :label-width="formLabelWidth">
                    <el-date-picker
                            v-model="busForm.endTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="已行驶路程" :label-width="formLabelWidth">
                    <el-input v-model="busForm.distanceNumber" :disabled="true" placeholder="0"></el-input>
                </el-form-item>
                <el-form-item label="上传图片" :label-width="formLabelWidth">
                    <el-input v-model="imageUrl" v-if="false"></el-input>
                    <el-upload
                            class="avatar-uploader"
                            ref="upload"
                            :show-file-list="false"
                            action="/api/bus/insertOne"
                            :before-upload="beforeUpload"
                            :on-change="handleChange"
                            :auto-upload="false"
                            :on-success="handleSuccess"
                            :data="busForm">
                        <img v-if="imageUrl" :src="imageUrl" class="avatar">
                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                    </el-upload>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible2 = false">取 消</el-button>
                <!--by:提交表单到后台请求-->
    <el-button type="primary" @click="busFormSubmit('busForm')">确 定</el-button>
  </span>
        </el-dialog>

    </div>
</template>

<script>
    export default {
        name: "busInformation",
        data(){
            return{
                route1:'',
                restaurants: [],
                restaurants1: [],
                restaurants2: [],
                restaurants3: [],
                state: '',
                state1:'',
                state2:'',
                tableData: [],
                imgsrc:'',
                mapSrc:'',
                dialogFormVisible: false,
                form: {
                    id:0,
                    createTime:'',
                    beginTime:'',
                    endTime:'',
                    betweenNum:''
                },
                formLabelWidth: '100px',
                urlparam:{
                    num:1,
                    size:15
                },
                loading: true,
                hhhh:true,
                currentPage4: 4,
                tabletotal:0,
                dialogVisible1: false,
                dialogVisible2:false,
                imgSrc:'',
                order:null,
                busForm: {
                    id: null,
                    distanceNumber: 0,
                    createTime: '',
                    routeId: 0,
                    beginTime: '',
                    endTime: '',
                    dayNum: 0,
                    mouthNum: 0,
                    yearNum: 0,
                    betweenNum: '',
                    times: 0,
                    chepai:''
                },
                imageUrl: '',
                uploadStaus:false,
                input4: '',
                multipleSelection: [],
                list:[],
                oldId:0,
                // xiangqing:{
                //     chepai:'',
                //     chuang:'',
                //     distanceNumber:'',
                //     lun:'',
                //     sex:'',
                //     time:'',
                //     yizi:'',
                //     youlian:''
                // },
                xiangqing:[],
                route:[]
            }
        },
        created() {
            this.getAll();
            this.initRoute();
        },
        mounted() {

        },
        methods:{
            chaxunId2(){
                this.$http({
                    url:'/bus/getChaxun2',
                    method:'get',
                    params:{
                        betweenNum:this.state2
                    }
                }).then(result=>{
                    console.log(result);
                    if(result.data.length>0){
                        this.tableData=result.data;
                        this.tabletotal=result.data.length;
                    }
                })
            },
            chaxunId1(){
                this.$http({
                    url:'/bus/getChaxun1',
                    method:'get',
                    params:{
                        route:this.state1
                    }
                }).then(result=>{
                    console.log(result);
                    if(result.data.length>0){
                        this.tableData=result.data;
                        this.tabletotal=result.data.length;
                    }
                })
            },
            chaxunId(){
                this.$http({
                    url:'/bus/getChaxun',
                    method:'get',
                    params:{
                        id:this.state
                    }
                }).then(result=>{
                    console.log(result);
                    if(result.data.length>0){
                        this.tableData=result.data;
                        this.tabletotal=result.data.length;
                    }
                })
            },
            shousuo(){
                let he={
                    id: 0
                };
                if(this.input4==''){
                    he.id=null;
                    this.urlparam.num=1;
                    this.urlparam.size=15;
                    this.getAll();
                }else {
                    he.id=this.input4;
                    this.$http({
                        url:'/bus/search',
                        method:'get',
                        params:he
                    }).then(result=>{
                        console.log(result);
                        if(result.status==200){
                            this.urlparam.num=1;
                            this.urlparam.size=1;
                            this.tabletotal=result.data.total
                            this.tableData=result.data.list
                        }
                    })
                }
            },
            downloadBus(){
                this.downloadRequest('/bus/daochu').then(resp=>{
                    console.log(resp)
                })
            },
            xiugai(row){
                console.log(row)
                this.$http({
                    url:'/bus/chuli',
                    method:'get',
                    params:{
                        chuli:2,
                        id:row.id
                    }
                }).then(result=>{
                    if(result.data>0){
                        this.getAll();
                    }
                })
            },
            DeleteBus(){
                this.$confirm('此操作将永久删除['+this.multipleSelection.length+']条信息, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let ids='?';
                    this.multipleSelection.forEach(item=>{
                        ids+='list='+item.id+'&';
                    });
                    this.deleteRequest('/bus/deleteAll'+ids).then(resp=>{
                        console.log(resp)
                        if(resp.data>0){
                            this.getAll();
                            this.$notify({
                                title: '成功',
                                message: '批量删除成功',
                                type: 'success'
                            });
                        }else {
                            this.$notify({
                                title: '失败',
                                message: '删除失败',
                                type: 'error'
                            });
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            querySearch(queryString, cb) {
                var restaurants = this.restaurants;
                console.log(this.loadAll());
                var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
                // 调用 callback 返回建议列表的数据
                cb(results);
            },
            querySearch1(queryString, cb) {
                var restaurants = this.restaurants1;
                console.log(this.loadAll());
                var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
                // 调用 callback 返回建议列表的数据
                cb(results);
            },
            querySearch2(queryString, cb) {
                var restaurants = this.restaurants2;
                console.log(this.loadAll());
                var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
                // 调用 callback 返回建议列表的数据
                cb(results);
            },
            querySearch3(queryString, cb) {
                var restaurants = this.loadAll4();
                console.log(this.loadAll4());
                var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
                // 调用 callback 返回建议列表的数据
                cb(results);
            },
            createFilter(queryString) {
                return (restaurant) => {
                    return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
                };
            },
            loadAll() {
                let tishi=[];
                for (let i = 0; i < this.tableData.length; i++) {
                    let jianyi={
                        value:''
                    };
                    jianyi.value=this.tableData[i].id.toString();
                    tishi.push(jianyi);
                }
                return tishi;
            },
            loadAll1() {
                let tishi=[];
                for (let i = 0; i < this.tableData.length; i++) {
                    let jianyi={
                        value:''
                    };
                    jianyi.value=this.tableData[i].route;
                    tishi.push(jianyi);
                }
                return tishi;
            },
            loadAll2() {
                let tishi=[];
                for (let i = 0; i < this.tableData.length; i++) {
                    let jianyi={
                        value:''
                    };
                    jianyi.value=this.tableData[i].betweenNum;
                    tishi.push(jianyi);
                }
                return tishi;
            },
            loadAll3() {
                let tishi=[];
                for (let i = 0; i < this.tableData.length; i++) {
                    let jianyi={
                        value:''
                    };
                    jianyi.value=this.tableData[i].route;
                    tishi.push(jianyi);
                }
                return tishi;
            },
            initRoute(){
                this.$http({
                    url:'/bus/getRoute',
                    method:'get'
                }).then(result=>{
                    console.log(result);
                    if(result.status==200){
                        this.route=result.data
                    }
                });
            },
            loadAll4() {
                let tishi=[];
                for (let i = 0; i < this.route.length; i++) {
                    let jianyi={
                        value:'',
                        address:''
                    };
                    jianyi.value=this.route[i].routeName;
                    jianyi.address=this.route[i].id.toString();
                    tishi.push(jianyi);
                }
                return tishi;
            },
            handleSelect(item) {
                console.log(item.value);
                this.busForm.routeId=parseInt(item.address);
                console.log(this.busForm.routeId);
                console.log(this.busForm.route)
            },
            handleIconClick(ev) {
                console.log(ev);

            },
            toggleSelection(rows) {
                if (rows) {
                    rows.forEach(row => {
                        this.$refs.multipleTable.toggleRowSelection(row);
                    });
                } else {
                    this.$refs.multipleTable.clearSelection();
                }
            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
                let va=[];
                this.multipleSelection.map(item=>{
                    va.push(item.id)
                })
                console.log(va);
                this.list=va;
            },
            getAll(){
                // console.log(this.urlparam)
                // this.getRequest("/bus/getAll",this.urlparam).then(result=>{
                //     console.log(result);
                //     if(result.status==200){
                //         this.$message({
                //             showClose: true,
                //             message: '获取信息成功',
                //             type: 'success'
                //         });
                //         this.tableData=result.data
                //     }
                // })
                this.$http({
                    url:'/bus/getAll',
                    method: 'GET',
                    params: this.urlparam
                }).then(result=>{
                    console.log(result);
                    if(result.status==200){
                        this.tableData=result.data.list;
                        this.hhhh=false;
                        this.tabletotal=result.data.total;
                        this.restaurants = this.loadAll();
                        this.restaurants1=this.loadAll1();
                        this.restaurants2=this.loadAll2();
                        this.restaurants3=this.loadAll3();
                        console.log(this.restaurants1);
                    }else {
                        this.$message({
                            showClose: true,
                            message: '发生了未知错误',
                            type: 'error'
                        })
                    }

                })

            },
            updateBus(id){
                this.dialogFormVisible=true;
                this.loading=true
                this.$http({
                    url: '/bus/getOne',
                    method:'GET',
                    params:{
                        id: id
                    }
                }).then(result=>{
                    console.log(result)
                    if(result.status==200){
                        this.oldId=result.data.id;
                        this.form.id=result.data.id;
                        this.form.beginTime=result.data.beginTime;
                        this.form.endTime=result.data.endTime;
                        this.form.betweenNum=result.data.betweenNum;
                        this.form.createTime=result.data.createTime;
                        this.timer = setTimeout(()=>{   //设置延迟执行
                            this.loading=false
                        },200);
                    }
                })
                // this.putRequest("/bus/updateOne",id).then(result=>{
                //     console.log(result);
                // })
            },
            deleteBus(salary){
                console.log(salary.id);
                this.$http({
                    url:'/bus/deleteOne',
                    method: 'delete',
                    params: {
                        id:salary.id
                    }
                }).then(result=>{
                    if(result.status==200){
                        this.$message({
                            showClose: true,
                            message: '删除信息成功',
                            type: 'success'
                        });
                        this.getAll();
                    }
                    console.log(result);
                })
            },
            updateBuselse(id){
                this.dialogFormVisible = false
                let bus={
                    id:0,
                    distanceNumber:null,
                    createTime:'',
                    route:null,
                    beginTime:'',
                    endTime:'',
                    dayNum:null,
                    mouthNum:null,
                    yearNum:null,
                    betweenNum:null,
                    times:null
                };
                bus.id=parseInt(this.form.id);
                bus.createTime=this.form.createTime;
                bus.beginTime=this.form.beginTime;
                bus.betweenNum=this.form.betweenNum;
                bus.endTime=this.form.endTime;
                console.log(this.form);
                console.log(bus);
                this.$http({
                    url:'/bus/updateOnee',
                    method:'put',
                    data: {
                        id:bus.id,
                        distanceNumber: null,
                        createTime:this.form.createTime,
                        route:null,
                        beginTime:this.form.beginTime,
                            endTime:this.form.endTime,
                            dayNum:null,
                            mouthNum:null,
                            yearNum:null,
                            betweenNum:this.form.betweenNum,
                            times:null,
                        oldId:this.oldId
                    }
                }).then(result=>{
                    console.log(result);
                    if(result.data>0){
                        this.getAll()
                        this.$notify({
                            title: '成功',
                            message: '修改成功',
                            type: 'success'
                        });
                    }else {
                        this.$notify({
                            title: '失败',
                            message: '未知错误',
                            type: 'error'
                        });
                    }
                })
            },
            handleSizeChange(val){
                this.urlparam.size=val;
                if(this.order==null){
                    this.getAll();
                }else if(this.order=='descending'){
                    console.log(val);
                    this.getDec();
                }else if(this.order=='ascending'){
                    this.getAsc();
                }

            },
            handleCurrentChange(val){
                this.urlparam.num=val;
                if(this.order==null){
                    this.getAll();
                }else if(this.order=='descending'){
                    console.log(val);
                    this.getDec();
                }else if(this.order=='ascending'){
                    this.getAsc();
                }

            },
            handleClose1(done) {
                this.$confirm('确认关闭？')
                    .then(_ => {
                        done();
                    })
                    .catch(_ => {});
            },
            information(data){
                this.dialogVisible1=true;
                this.imgSrc='';
                console.log(data);
                let param={
                    id:5
                };
                param.id=data.id;
                console.log(param);
                console.log(data);
                this.$http({
                    url:'/bus/getImg/'+data.id,
                    method:'GET',
                }).then(result=>{
                    if(result.status==200){
                        this.imgSrc="http://1.12.226.117:8081/bus/getImg/"+data.id;
                        this.$http({
                            url:'/bus/getBusSec',
                            method:'get',
                            params:param
                        }).then(result=>{
                            console.log(result);
                            // this.xiangqing=result.data.chepai;
                            // this.xiangqing=result.data.chuang;
                            // this.xiangqing=result.data.distanceNumber;
                            // this.xiangqing=result.data.lun;
                            // this.xiangqing=result.data.sex;
                            // this.xiangqing=result.data.time;
                            // this.xiangqing=result.data.yizi;
                            // this.xiangqing=result.data.youlian;
                            this.xiangqing=result.data
                        })
                    }
                }).catch(errorHandle=>{
                    console.log(errorHandle);
                    const { status } = errorHandle.response;
                    console.log(status);
                    if(status==404){
                        this.$message({
                            type:'error',
                            message:'无图片信息',
                            showClose: true
                        })
                    }
                });

            },
            tableHeaderColor({ rowIndex}) {
                if (rowIndex === 0) {
                    return 'background-color: lightblue;color: #fff;font-weight: 500;'
                }
            },
            formatter(row, column) {
                return row.address;
            },
            changeSort(val){
                console.log(val)
                this.order = val.order
                if(this.order=='descending'){
                    this.getDec();
                }else if(this.order=='ascending'){
                    this.getAsc();
                }else {
                    this.getAll();
                }

                console.log(this.order)
            },
            getDec(){
                this.$http({
                    url:'/bus/getDec',
                    method: 'GET',
                    params: this.urlparam
                }).then(result=>{
                    this.tableData=result.data.list
                })
            },
            getAsc(){
                this.$http({
                    url:'/bus/getAsc',
                    method: 'GET',
                    params: this.urlparam
                }).then(result=>{
                    this.tableData=result.data.list
                })
            },
            //进入提交表单对话框
            insertBus() {
                this.dialogVisible2 = true;
            },
            //提交表单
            busFormSubmit(formName){
                this.dialogVisible2 = false;

                let vm = this;
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        console.log(this.busForm.routeId);
                        console.log(this.busForm);
                        let hello= vm.$refs.upload.submit();
                        this.busForm.id=null;
                        this.busForm.beginTime=null;
                        this.busForm.createTime=null;
                        this.busForm.endTime=null;
                        this.busForm.routeId=0;
                        this.imageUrl=null;
                        console.log(hello)
                        // this.$message({
                        //     type:'success',
                        //     message: '添加成功',
                        //     showClose: true
                        // })
                    } else {
                        this.$message({
                            type:'error',
                            message: '添加失败',
                            showClose: true
                        })
                        return false;
                    }
                });
                this.$refs[formName].resetFields();
                this.imageUrl = '';
                // let bus = {
                //     id: 0,
                //     distanceNumber: null,
                //     createTime: '',
                //     route: null,
                //     beginTime: '',
                //     endTime: '',
                //     dayNum: null,
                //     mouthNum: null,
                //     yearNum: null,
                //     betweenNum: null,
                //     times: null
                // };
                // bus.id = this.busForm.id;
                // bus.route=this.busForm.route;
                // bus.createTime = this.busForm.createTime;
                // bus.beginTime = this.busForm.beginTime;
                // bus.endTime = this.busForm.endTime;
                // bus.distanceNumber=this.busForm.distanceNumber;
                // console.log(this.busForm);
                // console.log(bus);
                // this.$http({
                //     url: '/bus/insertOne',
                //     method: 'POST',
                //     params: {
                //         id: this.busForm.id,
                //         distanceNumber: this.busForm.distanceNumber,
                //         createTime: this.busForm.createTime,
                //         route: this.busForm.route,
                //         beginTime: this.busForm.beginTime,
                //         endTime: this.busForm.endTime,
                //         dayNum: this.busForm.dayNum,
                //         mouthNum: this.busForm.mouthNum,
                //         yearNum: this.busForm.yearNum,
                //         betweenNum: this.busForm.betweenNum,
                //         times: this.busForm.times
                //     }
                // }).then(result => {
                //     console.log(result);
                //     if (result.data > 0) {
                //         this.getAll()
                //         this.$notify({
                //             title: '成功',
                //             message: '添加成功',
                //             type: 'success'
                //         });
                //     } else {
                //         this.$notify({
                //             title: '失败',
                //             message: '未知错误',
                //             type: 'error'
                //         });
                //     }
                // })
            },
            handleAvatarSuccess(res, file) {
                this.imageUrl = URL.createObjectURL(file.raw);
            },
            beforeAvatarUpload(file) {
                // const isJPG = file.type === 'image/jpeg';
                // const isLt2M = file.size / 1024 / 1024 < 2;
                //
                // if (!isJPG) {
                //     this.$message.error('上传头像图片只能是 JPG 格式!');
                // }
                // if (!isLt2M) {
                //     this.$message.error('上传头像图片大小不能超过 2MB!');
                // }
                // return isJPG && isLt2M;
            },
            handleChange (file, fileList) {
                this.imageUrl = URL.createObjectURL(file.raw);
            },

            beforeUpload(file) {
                const isLt1M = file.size / 1024 / 1024 < 0.5;
                if (!isLt1M) {
                    this.$message.error('上传头像图片大小不能超过 500kb!');
                }
                return isLt1M;
            },
            handleSuccess(response, file, fileList){
                console.log(response)
                if(response>0){
                    this.$message({
                        type:'success',
                        message: '添加成功',
                        showClose: true
                    });
                    this.imageUrl='';
                    //强行刷新页面
                    location.reload();
                }else {
                    this.$message({
                        type:'error',
                        message: '添加失败',
                        showClose: true
                    })
                }
            }

        }
    }
</script>

<style scoped>
.mianbao{
    text-align: center;
}
    .shousuo{
        margin-top: 10px;
    }

.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.avatar-uploader .el-upload:hover {
    border-color: #409EFF;
}
.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
}
.avatar {
    width: 178px;
    height: 178px;
    display: block;
}

</style>
